<style src="./index.scss" lang="scss" scoped rel="stylesheet/scss"></style>
<template src="./index.html"></template>
<script>
export default {
    mixins: [Vue.prototype.$vFN.Mixins.Base],

    computed: {
        levelNum() {
            let _num = 0;
            if (this.level == "street") {
                _num = 4;
            } else if (this.level == "region") {
                _num = 3;
            } else if (this.level == "city") {
                _num = 2;
            } else if (this.level == "province") {
                _num = 1;
            }
            return _num;
        },
    },
    data() {
        return {
            // 外部传入
            appWindow: null,
            // 外部传入
            apiConfig: null,
            loading: -1,
            isOk: false,
            list: [
                {
                    name: "省",
                    list: [],
                    select: -1,
                },
                {
                    name: "市",
                    list: [],
                    select: -1,
                },
                {
                    name: "区/县",
                    list: [],
                    select: -1,
                },
                {
                    name: "乡镇/街道",
                    list: [],
                    select: -1,
                },
            ],
            boxVisible: false,
        };
    },
    methods: {
        async init() {
            this.boxVisible = true;
            await this.getList(0, 0);
            if (this.selected.provinceCode) {
                await this.getList(this.selected.provinceCode, 1);
            }
            if (this.selected.cityCode) {
                await this.getList(this.selected.cityCode, 2);
            }
            if (this.selected.regionCode) {
                await this.getList(this.selected.regionCode, 3);
            }
            if (this.selected.streetCode) {
                await this.getList(this.selected.streetCode, 4);
            }
        },

        async getList(id_, level_) {
            this.loading = level_;
            this.isOk = false;
            // 如果不是第一项
            if (level_ > 0) {
                let _index = null;
                this.list[level_ - 1].list.forEach((item, index) => {
                    if (item.id == id_) {
                        _index = index;
                    }
                });

                for (let i = level_ + 1; i < this.list.length; i++) {
                    this.list[i].list = [];
                }
                this.$set(this.list[level_ - 1], "select", _index);
            }
            // 如果点击的是最后一项
            if (level_ >= this.levelNum) {
                this.ok();
                return;
            }

            let _data = await this.$vFN.Http.post(
                {
                    url: this.apiConfig.list.url,
                    domain: this.apiConfig.list.domain,
                    data: {
                        parentId: id_,
                    },
                },
                this.appWindow
            );
            if (_data._ok) {
                let _list = _data.data;
                _list.forEach((item) => {
                    item.select = false;
                });

                for (let i = level_; i < 4; i++) {
                    this.$set(this.list[i], "list", []);
                    this.$set(this.list[i], "select", -1);
                }
                this.$set(this.list[level_], "list", _list);
            }
            this.loading = -1;
        },
        // 选择图片
        ok() {
            let _selected = this.selected;
            this.list.forEach((item, index) => {
                let _sub = item.list[item.select];
                if (index == 0 && index < this.levelNum) {
                    _selected.province = _sub.areaName;
                    _selected.provinceCode = _sub.id;
                } else if (index == 1 && index < this.levelNum) {
                    _selected.city = _sub.areaName;
                    _selected.cityCode = _sub.id;
                } else if (index == 2 && index < this.levelNum) {
                    _selected.region = _sub.areaName;
                    _selected.regionCode = _sub.id;
                } else if (index == 3 && index < this.levelNum) {
                    _selected.street = _sub.areaName;
                    _selected.streetCode = _sub.id;
                }
            });
            this.selected = _selected;
            this.isOk = true;
        },
        submit() {
            this.onSuccess({
                data: this.selected,
            });
            this.editBoxCancel();
        },
        // 成功回调
        onSuccess() {},
        // 取消回调
        onCancel() {},
        // 失败回调
        onError() {},
        // 关闭窗口
        editBoxClose() {
            this.boxVisible = false;
        },
        // 取消
        editBoxCancel() {
            this.editBoxClose();
        },
    },
    watch: {},
    mounted() {
        this.init();
    },
    beforeCreate() {},
};
</script>